<template>
  <div  v-show="!load" v-cloak>

    <el-row >
      <el-col :span="24" class="name">
        {{name}}
      </el-col>
    </el-row>
    <div style="height: 40px;"></div>
    <div class="content">{{content}}</div>
  </div>

</template>
<script>
  import {getLogContent} from "@/api/monitor/logFile";

  export default {
    name: "detail",
    data() {
      return {
        //获取路由传过来的路径
        path: "",
        name:"",
        content: "",
        dataQuery: {
          path: ""
        },
        load:true
      }
    },
    methods: {
      showData() {
         console.log(this.$route)
        this.dataQuery.path = this.$route.query.name
        this.name=this.$route.query.id
        console.log("传过来的参数", this.path);
        getLogContent(this.dataQuery).then(response => {
          this.content = response.msg
          this.load = false;
        })
      }
    },
    created() {
      this.showData()
    }
  }
</script>

<style scoped>
   .name{
     position: fixed;
     text-align: left;
     background-color: #f0f0f0;
     padding: 10px 20px;
     top:84px;
     font-size: 18px;
     font-weight: 600;
   }

  .content{
    word-break: break-all;
    white-space: pre-wrap;
    padding: 10px;
  }
</style>
